<!-- 客户接收验证码形式 -->
<template>
  <el-container>
    <el-header>
      <el-row class="navbar" :gutter="20">
        <el-col :span="12" :offset="0" align="left" justify="center">
          <el-image :src="logo" />
        </el-col>
        <el-col :span="12" :offset="0" align="right">
          <el-button link @click="goBack">登录</el-button>
        </el-col>
      </el-row>
    </el-header>
    <el-main>
      <el-card v-loading="loading" class="box-card">
        <el-row class="title">企业注册信息 </el-row>
        <el-row justify="center" :gutter="20">
          <el-col :span="20" :offset="0">
            <el-descriptions :column="3">
              <el-descriptions-item label="企业名称">{{ detailInfo.name }}</el-descriptions-item>
              <el-descriptions-item label="企业信用代码">{{ detailInfo.code }}</el-descriptions-item>
              <el-descriptions-item label="经济类型">{{ detailInfo.economicTypeName }}</el-descriptions-item>
              <el-descriptions-item label="单位类型">{{ detailInfo.typeName }}</el-descriptions-item>
              <el-descriptions-item label="注册资本">{{ detailInfo.regCapital }}</el-descriptions-item>
              <el-descriptions-item label="法人姓名">{{ detailInfo.legalman }}</el-descriptions-item>
              <el-descriptions-item label="法人手机号码">{{ detailInfo.legalMobile }}</el-descriptions-item>
              <el-descriptions-item label="法人职务">{{ detailInfo.legalDuty }}</el-descriptions-item>
              <el-descriptions-item label="法人职称">{{ detailInfo.legalTitle }}</el-descriptions-item>
              <el-descriptions-item label="归属区域">{{ detailInfo.areaName }}</el-descriptions-item>
              <el-descriptions-item label="邮编">{{ detailInfo.zipCode }}</el-descriptions-item>
              <el-descriptions-item label="企业注册日期">{{ detailInfo.registerDate }}</el-descriptions-item>
              <el-descriptions-item label="注册地址">{{ detailInfo.regAddr }}</el-descriptions-item>
              <el-descriptions-item label="办公地址">{{ detailInfo.officeAddr }}</el-descriptions-item>
              <el-descriptions-item label="联系人">{{ detailInfo.linkMan }}</el-descriptions-item>
              <el-descriptions-item label="联系人电话">{{ detailInfo.linkTel }}</el-descriptions-item>
              <el-descriptions-item label="企业备注">{{ detailInfo.remark }}</el-descriptions-item>
              <el-descriptions-item label="数据来源">{{ detailInfo.dataSourceName }}</el-descriptions-item>
              <el-descriptions-item label="营业执照" span="3">
                <span
                  v-for="item in detailInfo.attachments"
                  :key="item.attachmentId"
                  style="padding-right: 10px"
                  @click="download(item.attachmentId)"
                >
                  <el-link type="primary">{{ item.attachmentName }}</el-link>
                </span></el-descriptions-item
              >
            </el-descriptions></el-col
          >
        </el-row>
        <el-row class="title">审核意见</el-row>
        <el-row justify="center" :gutter="20">
          <el-col :span="20" :offset="0">
            <el-descriptions :column="1">
              <el-descriptions-item label="审核结果"
                ><el-tag type="danger">{{ detailInfo.checkStatusName }}</el-tag>
              </el-descriptions-item>
              <el-descriptions-item label="原因">{{ detailInfo.failureReason }}</el-descriptions-item>
            </el-descriptions></el-col
          >
        </el-row>
        <el-row justify="center" :gutter="20">
          <el-button type="primary" @click="goReg">重新注册</el-button>
        </el-row>
      </el-card>
    </el-main>
  </el-container>
</template>

<script setup lang="ts">
import { GetCorpRegResult } from "@/api/common/corp/index";
import { downloadFile } from "@/utils";
import { downloadAttachment } from "@/api/common/other/index";

const logo = ref(new URL(`../../../../assets/back/logo.png`, import.meta.url).href);
import { useRouter } from "vue-router";

const detailInfo = ref<any>({});
const router = useRouter();
const loading = ref(false);
//跳转登录
const goBack = () => {
  router.replace({ path: "/login" });
};
//跳转注册
const goReg = () => {
  router.push({ path: "/corpregister", query: router.currentRoute.value.query });
};

//  下载附件
const download = (id: string) => {
  downloadAttachment(id).then((res) => {
    downloadFile(res);
  });
};

onMounted(() => {
  loading.value = true;
  if (router.currentRoute.value.query.id) {
    GetCorpRegResult(router.currentRoute.value.query.id).then((res) => {
      detailInfo.value = res.data;
      loading.value = false;
    });
  }
});
</script>

<style lang="scss" scoped>
@-webkit-keyframes rotate-out-center {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
}
@keyframes rotate-out-center {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
}
.rotate-out-center {
  -webkit-animation: rotate-out-center 2s ease infinite both;
  animation: rotate-out-center 2s linear infinite both;
}

:deep(.el-row) {
  padding: 15px;
}
:deep(.navbar) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  //height: 50px;
  height: 90px;
  // background-color: rgba(31,41,55);
  //background-color: black;
  background-color: #3b98f7;
  // --menuBg: rgb(17 17 18);
  //box-shadow: 0 0 1px #0003;
  box-shadow: 0px 20px 40px rgba(255, 255, 255, 0.9);
  color: #fff;
}

:deep(.navbar .el-button span) {
  font-size: 20px;
  color: #fff;
}
:deep(.box-card) {
  width: 60vw;
  margin: 0 auto;
  margin-top: 5vh;
  padding: 50px;
}
:deep(.box-card .title) {
  border-left: 5px solid #3b98f7;
  margin-left: 50px;
  text-indent: 1em;
  line-height: 15px;
  font-weight: 600;

  padding: 5px;
}
</style>
